{% extends '::base.html.twig' %} 
{% block title %}Conceptos por Periodo :: Nuevo{% endblock %}

{% block module_name %}Conceptos por Periodo{% endblock %}

{% block body %}
<h2>Formulario</h2>
<div class="widget_inside records_list">
    <div class="form">
        <form action="{{ path('periodosenconceptos_create') }}" method="post" id="formID">
            <input type="hidden" name="idPeriodo" value="{{periodo.id}}" />
            <div class="clearfix">
                <label>Periodo</label>
                <div class="input"><input type="text" readonly value="{{ periodo.comentarios }}" /></div>
            </div>
            <div class="clearfix">
                <label>Tipo de Nomina</label>
                <div class="input"><input type="text" readonly class="large" value="{{ periodo.idTipoNomina.nombre }}" /></div>
            </div>
            <div class="widget_inside">
                <h4>Conceptos Disponibles</h4>
                {% if conceptos == null %}
                    <span class="notification information">Ya se han registrado todos los conceptos a este periodo</span>
                {% else %}
                    <table class="regular conceptosDisp">
                        <thead>
                            <tr>
                                <th><input id="selectAllConceptos" class="row" type="checkbox" name="AllConceptos" value="yes" /></th>
                                <th>Nombre</th>
                                <th>Abreviatura</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for concepto in conceptos %}
                            <tr>
                                <td><input type="checkbox" class="row concepto" name="conceptos[]" value="{{ concepto.id }}" /></td>
                                <td>{{ concepto.nombre }}</td>
                                <td>{{ concepto.abreviatura }}</td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                {% endif %}
            </div>
            <div class="clearfix grey-highlight">
                <div class="input no-label">
                    {% if conceptos != null %}<button type="submit" class="button blue">Guardar</button>{% endif %}
                    <a href="{{ path('periodos') }}" class="button">Regresar a la Lista</a>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    $(document).ready(function(){ 
        var tab = $('.conceptosDisp').dataTable( {
            "sPaginationType": "full_numbers",
            "bJQueryUI": true,
            "aoColumnDefs": [
              { 'bSortable': false, 'aTargets': [ 0 ] }
            ]
        });
        $("#selectAllConceptos").click(function (){
            if (this.checked == false) {
                var nNodes = $('input', tab.fnGetNodes());
                for ( var i=0 ; i<nNodes.length ; i++ ){
                    $('.concepto:checked').attr('checked', false);
                }
                var nHiddenNodes = $('input', tab.fnGetHiddenTrNodes());
                for ( var i=0 ; i<nHiddenNodes.length ; i++ ){
                    $('.concepto:checked').attr('checked', false);
                }
           } else {
               var nNodes = $('input', tab.fnGetNodes());
                for ( var i=0 ; i<nNodes.length ; i++ ){
                    $('.concepto:not(:checked)').attr('checked', true);       
                }
                var nHiddenNodes = $('input', tab.fnGetHiddenTrNodes());
                for ( var i=0 ; i<nHiddenNodes.length ; i++ ){
                    $('.concepto:not(:checked)').attr('checked', true);       
                }
           }
        }); 
        $(".concepto").click(function (){
            $('#selectAllConceptos').attr('checked', false);
        });
    });
</script>
{% endblock %}